<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                template="/WEB-INF/facelets/template.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:f="http://java.sun.com/jsf/core">
    
    <ui:define name="content">
        <h:form id="indexForm" prependId="false">
            <h:outputText id="indexHeader" value="Newly Released Movies!"/>
            <p:dataGrid var="movie" value="#{ViewIndexControllerBean.indexBean.movies}" columns="3">
                <p:column>
                    <p:panel styleClass="indexPanel"> 
                        <p:commandLink update="movieDetail" oncomplete="movieDialog.show()">
                            <p:graphicImage styleClass="indexMovieCover" value="#{movie.movieCover}" />
                            <f:setPropertyActionListener value="#{movie}" target="#{MoviePopUpBean.selectedMovie}"/>
                            <h2><h:outputText value="#{movie.title}"/></h2>
                        </p:commandLink>
                    </p:panel>
                </p:column>
            </p:dataGrid>
            <ui:include src="movieInfoPopUp.xhtml"/>
        </h:form>
    </ui:define>
</ui:composition>